<template>
  <div>
    <h2 align="center">借款项目列表</h2>
    借款款项名称:<input type="text" v-model="showBorrowData.B_Name">
    利息:
    <select v-model="showBorrowData.BI_Id">
      <option value="">==请选择==</option>
      <option v-for="item in list" :value="item.BI_Id">
        {{item.BI_Year}}年 {{ (item.BI_Number).toFixed(2)*100 }}%
      </option>
    </select>
    <input type="button" value="查询" @click="getBorrowList" class="btn btn-success">&nbsp;
    <input type="button" value="批量删除" @click="getBorrowList" class="btn btn-danger">
    <table class="table table-bordered">
      <tr>
        <td><input type="checkbox"></td>      
        <td>借款款项ID</td>
        <td>借款款项名称</td>
        <td>借款最高金额</td>
        <td>借款最高年限</td>
        <td>预计月还款金额</td>
        <td>利息</td>
        <td>操作</td>
      </tr>

      <tr v-for="item in borrowList" :key="item.B_Id">
        <td><input type="checkbox"></td>  
        <td>{{ item.B_Id }}</td>
        <td>{{ item.B_Name }}</td>
        <td>{{ item.B_Money }}</td>
        <td>{{ item.B_Year }}</td>
        <td>{{ ((item.B_Money+item.B_Money*item.T_Borrow_Interests.BI_Number)/item.B_Year/12).toFixed(2) }}CNY</td>
        <td>{{ (item.T_Borrow_Interests.BI_Number*100).toFixed(2) }}%</td>        
        <td>
          <input type="button" value="用户借款明细" @click="GetBorrow(item.B_Id)" class="btn btn-primary">      
        </td>
      </tr>
    </table>
  </div>

  <div>
    <span>共{{ listcount }}条数据,每页{{ showBorrowData.pagesize }}条,当前第:{{ showBorrowData.pageindex }}/{{ pagecount }}页</span>
    <span @click=""></span>
    <input type="button" value="首页" @click="Page('home')">&nbsp;
    <input type="button" value="上一页" @click="Page('prev')">&nbsp;
    <input type="button" value="下一页" @click="Page('next')">&nbsp;
    <input type="button" value="尾页" @click="Page('end')">&nbsp;
    <select @change="getBorrowList" v-model="showBorrowData.pagesize">
      <option :value="item" v-for="item in arr ">{{ item }}条/页</option>
    </select>&nbsp;
    <input type="text" v-model="page" size="4">
    <input type="button" value="Go" @click="Page('jump')" class="btn btn-primary">&nbsp;
  </div>

</template>

<script setup lang="ts">


import {onMounted, reactive,toRefs} from 'vue';

import { useRouter } from 'vue-router';

import axios from 'axios';

//路由
let router = useRouter();

//响应式数据
let data:any =reactive({
  list:[],
  borrowList:[],
  //查询条件
   showBorrowData:{
    B_Name:'',
    BI_Id:'',
    pagesize:3,
    pageindex:1,
   },
   listcount:'',
   pagecount:'',
   arr:[3,5,7],
   page:1
})

//解构
let {list,borrowList,showBorrowData,listcount,pagecount,arr,page} = toRefs(data);

//生命周期
//页面加载时
onMounted(()=>{
  getList()
  getBorrowList()
})

//获取利息表
const getList =()=>{
  axios({
    url:'/api/Borrow/GetBorrowInterest',
    method:'get',
  }).then(res=>{
    console.log(res);
    list.value=res.data.data
  }).catch(err=>{
    console.log(err);
    
  })
}

//获取借款信息列表
const getBorrowList=()=>{
  axios({
    url:'/api/Borrow/GetShowBorrowList',
    method:'get',
    params:showBorrowData.value
  }).then(res=>{
    console.log(res);
    borrowList.value=res.data.data.rows
    listcount.value=res.data.data.listcount
    pagecount.value=res.data.data.pagecount
  }).catch(err=>{
    console.log(err);   
  })  
}

//分页
const Page = (str:any)=>{
  if(str=='home'){
    if(showBorrowData.value.pageindex==1){
      return alert('已经是第一页了')
    }
    showBorrowData.value.pageindex=1
  }else if(str=='prev'){
    if(showBorrowData.value.pageindex<=1){
      return alert('已经是第一页了')
    }
    showBorrowData.value.pageindex--
  }else if(str=='next'){
    if(showBorrowData.value.pageindex>=pagecount.value){
      return alert('已经是最后一页了')
    }
    showBorrowData.value.pageindex++
  }else if(str=='end'){
    if(showBorrowData.value.pageindex==pagecount.value){
      return alert('已经是最后一页了')
    }
    showBorrowData.value.pageindex=pagecount.value
  }else{
    if(page.value==""){
      return alert('页码数不能为空')
    }
    if(page.value==showBorrowData.value.pageindex){
      return alert('已经在当前页了')
    }
    if(isNaN(page.value)){
      return alert('请输入数字')
    }
    if(page.value<1 || page.value>pagecount.value){
      return alert('输入的页码应在'+showBorrowData.value.pageindex+'-'+pagecount.value+'之间')
    }
    showBorrowData.value.pageindex=page.value
  }
  getBorrowList()
  page.value=showBorrowData.value.pageindex
}

//查看借款明细页面
const GetBorrow = (B_Id:any)=>{
  router.push({
    path:'/main/adminCheckBorrowListView',
    query:{
      B_Id:B_Id
    }
  })
}

</script>

<style scoped>

</style>